<template>
  <a-col :span="labelSpan">
    <a-form-model-item
      :label="attrObj.formLabel"
      :prop="attrObj.formProps"
      class="order-select"
    >
      <a-select
        :placeholder="changePlaceholder()"
        @change="handleSelectChange"
        v-model.trim="attrObj.formModel[attrObj.formProps]"
        :disabled="attrObj.fixedDisabled || attrObj.isDisabled"
        allowClear
      >
        <a-select-option
          v-for="item in options"
          :key="item.key"
          :value="item.key"
        >
          {{ item.title }}
        </a-select-option>
      </a-select>
    </a-form-model-item>
  </a-col>
</template>
<script>
import { BELONG_NATURE_LIST, PLACEHOLDER_SELECT } from "@/config/const";
export default {
  name: "FormSelect",
  data() {
    return {
      BELONG_NATURE_LIST,
      PLACEHOLDER_SELECT
    };
  },
  props: {
    options: {
      type: Array,
      default() {
        return BELONG_NATURE_LIST;
      }
    },
    attrObj: {
      type: Object,
      default() {
        return {
          formLabel: "",
          formProps: "",
          formModel: {},
          isDisabled: false,
          fixedDisabled: false
        };
      }
    },
    labelSpan: {
      type: Number,
      default: 6
    }
  },
  components: {},
  computed: {},
  mounted() {},
  methods: {
    handleSelectChange() {},
    changePlaceholder() {
      if (this.attrObj.fixedDisabled) return "";
      if (this.attrObj.isDisabled) return "";
      return PLACEHOLDER_SELECT;
    }
  }
};
</script>
<style lang="less" scoped>
.order-select {
  width: 70%;
}
</style>
